<script>
import { config, column } from './formConfig.js'
import BasicManage from '@/components/basic/BasicManage.vue'
import { mapState, mapMutations } from 'vuex'
import { deepClone } from '@/plugins/clone.js'
import { requestApi } from '@/requset/api'
export default {
    extends: BasicManage,
    data() {
        return {
            table_title: '角色',
            url: 'role',
            dialog: {
                config: [],
                form: {},
                title: '',
            },
            baseForm: {
                name: '',
                desc: '',
                dataId: null,
                permissionIdList: '',
                menu: [[1]],
            },
        }
    },
    methods: {
        ...mapMutations('backstage', ['getRoleList']),
        from(data) {
            let list = []
            this.menuType.forEach((item) => {
                data.menu.split(',').forEach((id) => {
                    if (id == item.id) {
                        if (item.type === 1) {
                            list.push([item.id])
                        }
                        if (item.type === 3) {
                            list.push([item.parent, item.id])
                        }
                    }
                })
            })
            data.menu = list
            return data
        },
        to(data) {
            data.menu = Array.from(new Set(data.menu.flat(1))).join(',')
            data.dataId = data.dataId[data.dataId.length - 1]
            return data
        },
        handleAdd() {
            this.BeforeAdd()
            this.dialog.config[0].disable = () => false
            this.dialog.config[2].show = () => true
            this.dialog.title = '添加' + this.table_title
            this.dialog.form = deepClone(this.baseForm)
            this.$refs.zyform.openDialog('add')
        },
        handleEdit(val) {
            this.dialog.config[0].disable = () => true
            this.dialog.config[2].show = () => false
            this.BeforeEdit()
            this.dialog.title = '编辑' + this.table_title
            this.dialog.form = this.from(deepClone(val))
            this.$refs.zyform.openDialog('change')
        },
        getlist() {
            this.$EventBus.$emit('undateRole')
            this.loading = true
            requestApi('post', this.url + `/getlist`, this.queryForm).then((res) => {
                this.tableData = res.data.data
                this.pagination = res.data.pagination
                this.loading = false
                this.getRoleList(
                    res.data.data.map((item) => {
                        item.name = item.desc
                        return item
                    }),
                )
            })
        },
        edit(data) {
            requestApi('post', this.url + '/edit', this.to(deepClone(data))).then((res) => {
                if (res.data.code == 0) {
                    this.$message({
                        type: 'success',
                        message: '编辑成功',
                    })
                    this.$EventBus.$emit('undateMenu')
                    this.getlist()
                    this.$refs.zyform.closeDialog()
                }
            })
        },
    },
    computed: {
        ...mapState('backstage', ['menuList', 'menuType', 'backstageList', 'backstageData']),
        operate() {
            return parseInt(sessionStorage.getItem('operate')) === 1
        },
    },
    created() {
        this.getlist()
        config[2].options = [
            {
                label: '超级管理员',
                value: 0,
                children: this.backstageData,
            },
        ]
        config[3].options = this.menuList.map((item) => {
            if (item.value == 1) item.disabled = true
            return item
        })
        let dirc = {}
        this.backstageList.forEach((item) => {
            dirc[item.id] = item.name
        })
        column[4].format = (val) => dirc[val]
        column[column.length - 1].buttons = [
            {
                text: '编辑',
                click: (val) => {
                    this.handleEdit(val)
                },
                icon: 'el-icon-edit',
            },
            {
                text: '删除',
                click: (val) => {
                    this.delete(val)
                },
                icon: 'el-icon-delete',
            },
        ]
        column[column.length - 1].if = this.operate
        this.tableColumn = column
        this.dialog.config = config
    },
}
</script>
